.flex(@jc:center, @al:center, @dir: row, @wrap: nowrap) {
  display: flex;
  justify-content: @jc;
  align-items: @al;
  flex-flow: @dir @wrap;
}

.grid(@repeat: 6, @rgap: 1.4rem, @cgap: 1.4rem) {
  display: grid;
  grid-template-columns: repeat(@repeat, 1fr);
  grid-gap: @rgap @cgap;
}

.grid-contain( @rgap: 1.2rem, @cgap: 1.2rem) {
  display: grid;
  grid-gap: @rgap @cgap;
}

.font-Medium(@size: 2.6rem, @color: #ffffff, @lineh: 2.6rem,@fontW:500) {
  font-size: @size;
  font-family: PingFangSC-Medium, PingFang SC;
  font-weight: @fontW;
  color: @color;
  line-height: @lineh;
}

.font-Regular(@size: 1.4rem, @color: #ffffff, @lineh: 1.4rem) {
  font-size: @size;
  font-family: PingFangSC-Regular, PingFang SC;
  font-weight: 400;
  color: @color;
  line-height: @lineh;
}

.wh-100(@w: 100%, @h: 100%) {
  width: @w;
  height: @h;
}
